<%--
  Created by IntelliJ IDEA.
  User: liuxianan
  Date: 2021/7/20
  Time: 9:50 下午
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="//unpkg.com/layui@2.6.8/dist/css/layui.css">
    <script src="//unpkg.com/layui@2.6.8/dist/layui.js"></script>
</head>
<body>

<table id="bookList" lay-filter="test"></table>

<script>
  layui.use(['form', 'table'], function(){
    var table = layui.table;

    //第一个实例
    table.render({
      elem: '#bookList'
      ,height: 312
      ,url: '/book/query' //数据接口
      ,method:"post"
      ,toolbar: '#toolbar'
      ,defaultToolbar: ['filter', 'exports', 'print']
      ,page: true
      ,cols: [[ //表头
        {field: 'bookId', title: 'ID', width:80, sort: true, fixed: 'left'}
        ,{field: 'bookName', title: '书名', width:80}
        ,{field: 'bookCounts', title: '数量', width:80, sort: true}
        ,{field: 'detail', title: '细节', width:80}
      ]]
    });

  });
</script>


</body>
</html>
